import React, { Suspense } from 'react';
import { Provider } from 'react-redux';
import { Router, Switch, Route } from 'react-router-dom';
import './App.module.scss';
import store from './store';
import history from '@/common/history';
import { FitLayout } from '@/layouts/fit-layout';
import { Intl, Auth } from '@/components';

const fitLayoutUrls = [
  '/'
];

function handleAuth(dispatch, setIsLoading) {
  setTimeout(() => {
    setIsLoading(false);
  }, 2000);
}

function App() {
  return (
    <Provider store={store}>
      <Router history={history}>
        <Suspense fallback={<div>Loading chunk...</div>}>
          <Intl>
            <Auth onMounted={handleAuth}>
              <Switch>
                <Route path={fitLayoutUrls} exact>
                  <FitLayout />
                </Route>
                <Route path={'/'}>
                  <div>others</div>
                </Route>
              </Switch>
            </Auth>
          </Intl>
        </Suspense>
      </Router>
    </Provider>
  );
}

export default App;
